<template>
  <div class="other-portfolios">
    <div class="headline">
      <span></span>TA的组合持仓
    </div>

    <table class="table">
      <tbody>
      <tr :data-groupId="item.groupId" v-for="(item,index) in groupList" @click.stop.prevent="toGroupDetail(item)">
        <td class="one">
          <div class="wrapper-sm" :class="item.totalProfitrate< 0 ? 'negative': 'positive'"
               v-if="item.totalProfitrate != '关停'">
            {{item.totalProfitrate}}
          </div>
          <div class="guanting" v-else>
            {{item.totalProfitrate}}
          </div>
        </td>

        <td class="two">
          <span class="is-group">组合</span>
          <span>{{item.name}}</span>
        </td>

        <td class="three">
          <div class="value" :class="item.income< 0 ? 'negative': 'positive'">{{item.income}}</div>
          <div class="key">累计盈亏</div>
        </td>

        <td class="four">
          <i class="iconfont icon-xiangyou"></i>
        </td>
      </tr>
      </tbody>
    </table>

    <div class="placeholder" v-if="groupList.length == 0">
      <div class="content">
        <div class="tips" v-if="error ==''">哎呦，TA还没有<span class="">组合持仓</span>哦</div>
        <div class="tips" v-if="error !=''">{{error}}</div>
      </div>
    </div>
  </div>
</template>

<script>
  import RemoteDAO from 'common/remoteDAO'
  import CommonUtil from 'common/common.util'
  import LocalDAO from 'common/localDAO'

  export default {
    data () {
      return {
        userCode: LocalDAO.getUserCode(),
        groupList: [],
        error:"",
        testData:'testData'
      }
    },
    props: {
      clientId: {
        type: String
      }
    },
    created: function () {
      this.fetchData()
    },
    watch: {
      '$route.query.userCode' (to, from) {
        //跳转相同页面，组件不重新构建，无法调用created,故需监听
        this.fetchData ()
      }
    },
    methods: {
      fetchData(){
        var self = this
        //查询用户组合列表
        RemoteDAO.callJCL11138(self.clientId,'0', function (response) {
          if(Number(response.error) === 0){
            var data =response.data.body.grouplist;
            var list = [];
            _.each(data, function (item, index) {
              var object = {};
              object.groupId = item.group_id;
              object.name = item.group_name;
              object.position = CommonUtil.toFixed(item.position, 2);
              object.income = CommonUtil.toFixed(item.total_profit, 2);
              object.statue = item.statue;
              if(object.income>=0){
                object.income = "+" + object.income;
              }
              var totalProfitrate = CommonUtil.toFixed(item.total_profitrate, 2);
              if(totalProfitrate>0){
                totalProfitrate = "+"+totalProfitrate
              }
              if (item.statue != "0") {
                object.totalProfitrate = totalProfitrate +"%";
              } else if (item.statue == "0") {
                object.totalProfitrate = "关停";
              }
              list.push(object);
            });
            self.groupList = list;
          }else{
            self.error = response.data;
          }
        });
      },
      toGroupDetail(item){
        var self  = this;
        var groupId = item.groupId;
        self.$router.push({path: '/groupdetail', query: {groupId: groupId, clientId: self.clientId}})
      }
    }
  }
</script>

<style scoped>

</style>
